
<!DOCTYPE html>
<html>
<head>
    <title>登录页面</title>
    <meta charset="utf-8"/>
    <link rel="stylesheet" href="../static/src/xiaoliyu/css/forlogin.css">
</head>
<body>
<form action="http://127.0.0.1:8082/api/auth/login" method="post">
    <h1>欢迎登录卖鱼网站</h1>
    <label for="username">用户名：</label>
    <input type="text" id="username" name="username" required>
    <label for="password">密码：</label>
    <input type="password" id="password" name="password" required>
    <button type="submit">登录</button>
    <button type="button" class="btn-register" onclick="location.href='./register'">注册</button>
</form>
<script src="../static/src/xiaoliyu/js/xiaoliyu.js"></script>
<script >
    const form = document.querySelector('form'); // 获取form元素
    const loginButton = document.querySelector('#login-button'); // 获取登录按钮

    loginButton.addEventListener('', (event) => {
        event.preventDefault(); // 阻止默认的提交行为
        const formData = new FormData(form); // 获取表单数据

        // 创建XMLHttpRequest对象
        const xhr = new XMLHttpRequest();

        // 发送POST请求，将表单数据发送到服务器
        xhr.open('POST', 'http://127.0.0.1:8080/api/auth/login');

        xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

        xhr.withCredentials = true; // 启用cookie
        xhr.onreadystatechange = function() {
            if (xhr.readyState === 4 && xhr.status === 200) {
                // 登录成功
                console.log('登录成功！');
            } else {
                // 登录失败
                console.log('登录失败！');
            }
        };
        xhr.send(new URLSearchParams(formData).toString()); // 将表单数据编码为URL参数，并发送请求
    });
</script>
</body>
</html>